﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />

    <title>倩女幽魂官网</title>
    <style type="text/css">
        * {
            margin:0px;
            padding: 0px;
        }

        a {
            text-decoration:none; 
        }

        div {
             width: 100%;
             height:100%;
        }

        #nav {
             width:100%;
             height:70px;
             margin:0 auto;     
        }

        #nav ul {
           list-style:none;
            padding-left: 35%;
        }

        #nav ul li {
            float:left;
            line-height:70px;
            text-align:center;
            position:relative;
            padding-left:5%;
        }

        #nav ul li a{
           text-decoration:none;
           color:#E92435;
            display:block;
            padding:0px 10px;
       
        }

        #nav ul li a:hover{
            color:#7FFFD4;
            background:#333;
        }

        #nav ul li ul {
             position:absolute;
             display:none;
        }

        #nav ul li ul li {
             float:none;
             line-height:70px;
             text-align:left;
        }

         #nav ul li ul li a {
            width:100%;
        }

         #nav ul li ul li a:hover {
          background-color:#999;
        }

         #nav ul li:hover ul {
            display:block;
        }

         #bg {
            width:100%;
            height:600px;
        }

         #sm {
            overflow:hidden;
            width:100%;
            height:600px;
            margin:0 auto;
            padding-top:10px;
        }

        #main {
                width: 100%;
                height: 40%;
        }

        #show {
            width: 30%;
            height: 30%;
            display:none;
            align-items: flex-start;
            padding-left: 20%;
            margin-top: 2%;
        }

        #bor {
            border: dashed;
            border-color:lightgray;
            padding-left: 2%;
        }

        #character {
            width: 100%;
            height: 10%;
            font-family: "微软雅黑";
            font-size:16px;
            borde:1px;
            background-color: #999999;
        }

        #enn {
            width: 70%;
            height: 70%;
            background-color:#000000;
            padding-left: 30%;
            display: flex;
            align-items: flex-start;
        }

         #war {
             width: 50%;
             height: 50%;
             font: "宋体";
             font-size: 20px;
             padding-left: 10%;
        }
        body {
            background: url(https://i03picsos.sogoucdn.com/be33bb16166bcaa7) no-repeat center;
            background-size: 1000px;
            background: url(https://i03picsos.sogoucdn.com/be33bb16166bcaa7) no-repeat center;
            background-size: 1000px;
            background: url(https://i01picsos.sogoucdn.com/2bc2e5d3afd40c45) no-repeat  center;
            background-size: 1200px;
            background-image: radial-gradient(https://i01picsos.sogoucdn.com/2bc2e5d3afd40c45);
            /*https: //img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi02picsos.sogoucdn.com%2F8e3335a3223bab56&appid=122;*/
            /*background-size: cover;*/
            /*background-attachment: fixed;*/
        }
    </style>
 
</head>

<body>
    <div id="header" style="background-color:lightblue;">
        <h1 style="margin-bottom:50px; margin-left:45%;" >倩女幽魂官网</h1>
    </div>
    <div id="menu" style="background-color:lightblue;height:1000px;width:100px;float:left;">
        <b>公告</b><br>
        活动<br>
        赛事<br>
        直播
    </div>
     <div id="nav">
            <ul>
            
            <li><img src="http://www.logoids.com/upload/2016-07/2/2016719473669272.jpg"  style="width:100px;height:100px;"/></li>
               
            <li><a href="https://baike.sogou.com/v15827.htm?fromTitle=%E7%BD%91%E6%98%93%E5%85%AC%E5%8F%B8">网易公司</a></li>
               
            <li>
                <a href="#">角色分类</a>
                 <ul>
                    <li><a href="https://xqn.163.com/features/hh-m.html">画魂<img src="https://i04picsos.sogoucdn.com/19798d880c168fa2" /></a></li>
                     <li><a href="https://xqn.163.com/features/yans.html">偃师<img src="https://i04picsos.sogoucdn.com/5750d22f382b16fd" /></a></li>
                     <li><a href="https://xqn.163.com/features/ss.html">射手<img src="https://i01picsos.sogoucdn.com/53b14a68526928fa" /></a></li>
                     <li><a href="https://xqn.163.com/features/xk.html">侠客<img src="https://i01picsos.sogoucdn.com/c14aaec5055ca141" /></a></li>
                     <li><a href="https://xqn.163.com/features/fs.html">方士<img src="https://i03picsos.sogoucdn.com/ccbcf8c0e5613aac" /></a></li>
                     <li><a href="https://xqn.163.com/features/ys.html">医师<img src="https://i03picsos.sogoucdn.com/08b79f8bf1343374" /></a></li>
                     <li><a href="https://xqn.163.com/features/mz.html">魅者<img src="https://i02picsos.sogoucdn.com/aa071a996408b733" /></a></li>
                     <li><a href="https://xqn.163.com/features/yr.html">异人<img src="https://i01picsos.sogoucdn.com/f0bd4dd783d00750" /></a></li>      
                </ul>
                
            </li>
            
            
        </ul>
        
    </div>
     <div id="bg">
             <div id="sm">
                     <table>
                
                <tr>
                    
                    <td id="Pic1">
                          <table>
                            
                            <tr>
                                <td><img src="https://i01picsos.sogoucdn.com/f29ba9f16ae4d63c" onmouseover="mouseover(this)" onmouseout="mouseout(this)" /></td>
                                
                                <td><img src="https://i02picsos.sogoucdn.com/f4cea77e89445818" onmouseover="mouseover(this)" onmouseout="mouseout(this)" /></td>
                                
                                <td><img src="https://i01picsos.sogoucdn.com/187bfb25876b9fc5" onmouseover="mouseover(this)" onmouseout="mouseout(this)" /></td>
                                
                                <td><img src="https://i02picsos.sogoucdn.com/e4d71c9c90dc92cc" onmouseover="mouseover(this)" onmouseout="mouseout(this)" /></td>
                                
                                <td><img src="https://i02picsos.sogoucdn.com/d8b79c70fc4daea3" onmouseover="mouseover(this)" onmouseout="mouseout(this)" /></td>
                                
                            </tr>
                            
                        </table>
                        
                    </td>
                    
                    <td id="Pic2"></td>
                    
                </tr>
                
            </table>
            
        </div>
        
    </div>
    <script>
             Pic2.innerHTML=Pic1.innerHTML;
             function scrolltoleft(){
                     sm.scrollLeft++;
                     if(sm.scrollLeft>=Pic1.scrollWidth)
                             sm.scrollLeft=0;
                 }
             var MyMar=setInterval(scrolltoleft,40);
             function mouseover(x){
                     x.style.width="210";
                     x.style.height="256"
                     x.style.cursor="pointer"
                 }
             function mouseout(x){
                    x.style.width="105";
                    x.style.height="128"
                 }
             sm.onmouseover=function(){
                     clearInterval(MyMar);
                 }
             sm.onmouseout=function(){
                     MyMar = setInterval(scrolltoleft,40);
                }
         </script>
     <div id="main">
            <div id="show">
                    <p id="bor"><a href="https://xqn.163.com/newbie/rmzn.html#"><img src="https://i01picsos.sogoucdn.com/27fd9f0ad97fbd27" /> ></a></p>
                    <p id="bor"><a href="https://xqn.163.com/newbie/rmzn.html#"><img src="https://i01picsos.sogoucdn.com/964580f6d6db87b4" /></a></p>
                    <p id="bor"><a href="https://xqn.163.com/newbie/rmzn.html#"><img src="https://i01picsos.sogoucdn.com/b6c963b9717d17d8" /></a></p>
                   <p id="bor"><a href="https://xqn.163.com/newbie/rmzn.html#"><img src="https://i02picsos.sogoucdn.com/97429ed27f33e04f" /></a></p>

        </div>
        
    </div>
     <div id="character" style="background-color:lightblue;margin-top:-500px;">
           <h3> <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;本游戏适合16岁以上的玩家进入的用户使用；积极健康的游戏心态是健康游戏的开端，本游戏故事情节设置紧凑，请您合理控制游戏时间，避免沉溺游戏影响生活，注意自我保护，防范网络陷阱。</p></h3>
        
    </div>
     <div id="enn">
            <p><a href="http://game.163.com/news/2010/6/9/442_216957.html"><img src="https://i02picsos.sogoucdn.com/6f4535b5304ab0a0" style="width:500px;height:300px;float:left;" /></a></p>

         <div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
             <p id="war">
                 <a href="http://game.163.com/news/2010/6/9/442_216957.html">
                     <font color="aliceblue">
                         公司简介 - 客户服务 - 相关法律 - 网易游戏 - 隐私政策 - 联系我们 - 商务合作 - 加入我们<br>杭州网易雷火科技有限公司版权所有 ©1997-2019<br>COPYRIGHT©2017-2018 TENCENT.ALL RIGHTS RESERVED.
                     </font>
                 </a>
                 <br><a href="http://game.163.com/news/2010/6/9/442_216957.html"> <font color="aliceblue">文网游备字[2011]C-RPG007号 《网络文化经营许可证》 浙网文[2019]1372-138号 ISBN 978-7-89462-834-3</font></a>
             </p>
         </div>
    </div>
 
</body>
</html>